<template>
	<view class="content">
		<view class="backgroud-top">
			<image src="/static/index.jpg"></image>
		</view>
		<view class="job-box">
			<view class="job-box-item" @click="tableList">
				<view>
					<image src="/static/index/notebook.png"></image>
				</view>
				<view>
					项目列表
				</view>
			</view>

			<view class="job-box-item" @click="toApply()" v-if="hasPermission(['points:poiApply:add'])">
				<view>
					<image src="/static/index/draw.png"></image>
				</view>
				<view>
					积分申请
				</view>
			</view>
			<view class="job-box-item" @click="toExamine(200)" v-if="hasPermission(['points:poiApplyExamine:poiApplyExamine'])">
				<view>
					<image src="/static/index/checklist.png"></image>
				</view>
				<view>
					管理审核
				</view>
			</view>
			<view class="job-box-item" @click="toExamine(300)" v-if="hasPermission(['points:poiApplyReexamine:poiApplyReexamine'])">
				<view>
					<image src="/static/index/online-conference.png"></image>
				</view>
				<view>
					管理复核
				</view>
			</view>
			<view class="job-box-item" @click="toManagement" v-if="hasPermission(['points:poiManagement:add'])">
				<view>
					<image src="/static/index/edit-tools.png"></image>
				</view>
				<view>
					管理评分
				</view>
			</view>
			<view class="job-box-item" @click="toMyApply">
				<view>
					<image src="/static/index/group.png"></image>
				</view>
				<view>
					我的申请
				</view>
			</view>
		</view>
		<view class="notice-bg">
			<image src="/static/index/gonggaolan.png"></image>
			<view class="more-others" @click="toNoticeList">更 多 _>></view>
			
			<view class="notice-box">
				<view class="notice-box-item" v-for="(item, index) in dataList" :key="index" @click="toNotice(item.noticeId)">
					<view><uni-icons type="sound-filled" size="20" color="#ffc71d"></uni-icons></view>
					<view>
						{{parseTime(item.createTime, '{y}.{m}.{d}') +' - ' + item.noticeTitle}}
					</view>
				</view>
				
			</view>
			
			
		</view>
		
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				dataList:[],
			}
		},
		onShow() {
			this.getNoticeList()
		},
		methods: {

			getNoticeList() {
				this.$http({
					url: '/system/notice/list',
					method: 'get',
					params: {
						pageNum: 1,
						pageSize: 3,
						noticeType: 2,
					}
				}).then(res => {
					this.dataList = res.rows;
				});
			},
				
			tableList() {
				uni.navigateTo({
					url: '/pages/apply/tableList/tableList'
				})
			},
			toApply() {
				uni.navigateTo({
					url: '/pages/apply/applyList/applyList'
				})
			},
			toExamine(status) {
				uni.navigateTo({
					url: '/pages/apply/exmineList/exmineList?status='+encodeURIComponent(status)
				})
			},
			toManagement(){
				uni.navigateTo({
					url: '/pages/apply/managementList/managementList'
				})
			},
			toMyApply(){
				uni.navigateTo({
					url: '/pages/apply/myApplyList/myApplyList'
				})
			},
			toNotice(noticeId){
				uni.navigateTo({
					url: '/pages/notice/notice/notice?noticeId='+encodeURIComponent(noticeId)
				})
			},
			toNoticeList(){
				uni.navigateTo({
					url: '/pages/notice/noticeList/noticeList'
				})
			}
		}
	}
</script>

<style lang="scss">
	.backgroud-top {
		width: 720rpx;
		background: white;
		border-radius: 20rpx;

		image {
			width: 100%;
			border-radius: 20rpx;
		}
	}

	.job-box {
		background: white;
		display: flex;
		justify-content: center;
		align-items: center;
		flex-wrap: wrap;
		width: 720rpx;
		padding-top: 20rpx;
		margin-top: 20rpx;
		border-radius: 10rpx;

		.job-box-item {
			display: flex;
			justify-content: center;
			align-items: center;
			flex-direction: column;
			height: 180rpx;
			width: 100rpx;
			width: 30%;

			view:nth-child(1) {
				height: 120rpx;
				width: 100%;
				//border: solid 8rpx #1296db;
				padding: 10rpx;
				border-radius: 8rpx;
				text-align: center;

				image {
					width: 100rpx;
					height: 100rpx;
				}
			}

			view:nth-child(2) {
				height: 60rpx;
				width: 100%;
				text-align: center;
				line-height: 30rpx;
				letter-spacing: 4rpx;
				font-size: 24rpx;
				//font-weight: bolder;
			}
		}
	}
	.notice-bg{
		position: relative;
		width: 720rpx;
		height: 500rpx;
		background-color: white;
		margin-top: 20rpx;
		border-radius: 10rpx;
		z-index: 10;
		image{
			position: absolute;
			left: 1%;
			top: 2%;
			height: 92%;
			width: 98%;
			z-index: 20;
		}
		.more-others{
			position: absolute;
			right: 8%;
			top: 19%;
			z-index: 25;
			font-size: 26rpx;
			color: #9e9e9e;
		}
		.notice-box{
			margin: 20% 12% 20% 12%;
			height: 60%;
			width: 76%;
			z-index: 100;
			.notice-box-item{
				display: flex;
				justify-content: flex-start;
				align-items: flex-start;
				z-index: 101;
				view:nth-child(1) {
					height: 50rpx;
					line-height: 50rpx;
					width: 13%;
					z-index: 102;
				}
				view:nth-child(2) {
					line-height: 50rpx;
					font-size: 30rpx;
					width: 87%;
					color: #767676;
					z-index: 102;
				}
			}
		}
	}
</style>